/* eslint-disable no-unused-vars */
import inherits from 'inherits';

import BaseRenderer from 'diagram-js/lib/draw/BaseRenderer';

import { append as svgAppend } from 'tiny-svg';

import { CustomElements, CustomConfig, LabelElements } from './consts';
import { createItem } from './helper';


export default function CustomRenderer(eventBus, styles, textRenderer, bpmnRenderer, modeling) {
  BaseRenderer.call(this, eventBus, 2000);

  var computeStyle = styles.computeStyle;

  // console.log('computeStyle', computeStyle, this);

  this.bpmnRenderer = bpmnRenderer;
  this.modeling = modeling;
}

inherits(CustomRenderer, BaseRenderer);

CustomRenderer.$inject = ['eventBus', 'styles', 'textRenderer', 'bpmnRenderer', 'modeling'];

CustomRenderer.prototype.canRender = function (element) {
  // return true;
  return !element.labelTarget;
};

CustomRenderer.prototype.drawShape = function (p, element) {
  console.log('render drawShape', element.businessObject, element);

  return this.drawCustomElements(p, element);
};

CustomRenderer.prototype.getShapePath = function (shape) {
  console.log('render getShapePath', shape);
};

CustomRenderer.prototype.customDraw = function (type, element, parentNode) {
  const { attr, type: elType, textAttr, ...others } = CustomConfig[type];
  const customIcon = createItem(elType, {
    ...attr,
    ...others,
  });

  element['width'] = attr.width;
  element['height'] = attr.height;

  svgAppend(parentNode, customIcon);

  // 判断是否有name属性来决定是否要渲染出label
  if (LabelElements.includes(type) && element.businessObject.name) {
    const text = createItem('text', {
      x: textAttr.x,
      y: textAttr.y,
      'font-size': '12',
      'text-align': 'center',
      fill: '#000',
    });

    text.innerHTML = element.businessObject.name;
    svgAppend(parentNode, text);
    console.log(text);
  }

  return customIcon;
};

CustomRenderer.prototype.drawCustomElements = function (parentNode, element) {
  console.log(element);
  const type = element.type; // 获取到类型

  if (CustomElements.includes(type)) {
    return this.customDraw(type, element, parentNode);
  }

  const shape = this.bpmnRenderer.drawShape(parentNode, element);
  return shape;
};
